/*
 * layui的初始化模块可以理解为，引入这个模块的js文件
 * 值得注意的是：layui的模块之间存在依赖关系，例如引入了table模块，它会layui/lay/moudules/table.js
 * 这个文件引入进来，并且它还会将这个模块所依赖的其他模块自动加入进来，
 * 实际引入的模块有：table、form、jquery、layer、laypage、laytpl、util，7个js文件
 * 所以我仅仅初始化了table模块，却能获得form、jquery、layer的模块对象
 */
//layui初始化表格模组
layui.use([ 'table' ,'laydate','util','upload'], function() {
	// 获得模块对象
	var table = layui.table;
	var form = layui.form;
	var $ = layui.jquery;
	var layer = layui.layer;
	var laydate=layui.laydate;
	var util = layui.util;
	var upload = layui.upload;

	//定义用户头像
	var headImage;
	
	// 数据表格渲染
	table.render({
		elem : '#userTable',
		url : 'system/user',
		method : 'get',
		where : {} // 你额外要携带数据，以键值对的方式存入
		,
		toolbar : '#userToolbar' // 开启头部工具栏，并为其绑定左侧模板
		/*,
		cellMinWidth : 80*/ // 全局定义所有常规单元格的最小宽度（默认：60）
		,
		cols:[[
			{type : 'numbers'}, // 序号
			{type : 'checkbox'},//复选框
			{
				field : 'headImage',
				title : '用户头像',
				align:"center",
				width: 150,
				height: 220,
				templet: function(d){
					return "<img src='" + d.headImage + "' width='30px'  height='30px'>"  ;
			      }
			},
			{field : 'userId',title : '用户 ID',unresize : true,hide:true,align:"center"},
			{field : 'userName',title : '用户名字',unresize : true,align:"center"},
			{field : 'userPhone',title : '用户电话',unresize : true,align:"center"},
			{field : 'password',title : '用户密码',unresize : true,hide:true,align:"center"},
			{field : 'orgId',title : '组织 ID',unresize : true,hide:true,align:"center"},
			{field : 'orgName',title : '组织名字',unresize : true,align:"center"},
			{field : 'userSex',title : '用户性别',unresize : true,align:"center"},
			{field : 'userBirthdate',title : '出生日期',unresize : true,hide:true,align:"center"},
			{field : 'userHiredate',title : '入职日期',unresize : true,hide:true,align:"center"},
			{field : 'useable',title : '用户状态',unresize : true,templet : '#checkboxTpl',align:"center"},
			{field : 'description',title : '用户描述',unresize : true,hide:true,align:"center"},
			{field : 'createTime',title : '创建时间',unresize : true,hide:true,align:"center"},
		]],
		page : true // 开启分页
		,
		limit : 10 // 每页显示的条数
		,
		limits : [ 10, 20, 50, 100 ] // 每页条数的选择项
		,
		loading : true // 是否显示加载条(切换分页的时候显示）
		,
		title : '取派标准表' // 定义 table 的大标题（在文件导出等地方会用到）
		// ,id: 'userTable' // 设定容器唯一 id
		,
		// 隔行变色
		even : false
		,
		done:function(res,curr,count){
            hoverOpenImg();//显示大图
            $('table tr').on('click',function(){
                 $('table tr').css('background','');
                 $(this).css('background','<%=PropKit.use("config.properties").get("table_color")%>');
             });
        }
	});
	
	function hoverOpenImg(){
        var img_show = null; // tips提示
        $('td img').hover(function(){
            //alert($(this).attr('src'));
            var img = "<img class='img_msg' src='"+$(this).attr('src')+"' style='width:130px;' />";
            img_show = layer.tips(img, this,{
                tips:[2, 'rgba(41,41,41,.5)']
                ,area: ['160px']
            });
        },function(){
            layer.close(img_show);
        });
        $('td img').attr('style','max-width:70px');
    }
	// ---------------------------------
	//添加时间选择器
	laydate.render({
	  elem: '#addUserBirthdate'
	});
	laydate.render({
		  elem: '#addUserHiredate'
		});
	//修改时间选择器
	laydate.render({
		  elem: '#updateUserBirthdate'
		});
		laydate.render({
			  elem: '#updateUserHiredate'
			});
	
	//-------------
	// 头部搜素表单提交
	form.on('submit(userSearchBtn)', function(data) {
		/*console.log(data.elem) // 被执行事件的元素DOM对象，一般为button对象
		console.log(data.form) // 被执行提交的form对象，一般在存在form标签时才会返回
		console.log(data.field) // 当前容器的全部表单字段，名值对形式：{name: value}
*/		 
		 // 执行后台代码
		// 刷新数据表格
		table.reload('userTable', {
			url : 'system/user',
			where : { // 设定异步数据接口的额外参数，任意设
				userName : $("#queryUserName").val(),
				userSex : $("#queryUserSex").val(),
				orgName : $("#queryOrgName").val(),
				useable : $("#queryUseable").val(),
			},page:{
				curr:1 //从第一页开始
			},limit:10
		});
		return false; // 阻止表单跳转。如果需要表单跳转，去掉这段即可。
	});
	// 新增表单提交
	form.on('submit(addUserBtn)', function(data) {
	
		data.field.orgName = $("#addOrgName :selected").text();
		data.field.headImage =headImage;
		// 执行后台代码
		$.ajax({
			type : 'POST',
			async : false,
			url : 'system/user',
			data : data.field,
			success : function(data) {
				// 关闭页面上所有类型的所有弹框
				layer.closeAll();
				if (data == 1) {
					layer.msg("成功！", {
						icon : 1, // 图标，可输入范围0~6
						time : 2500
					// 2秒关闭（如果不配置，默认是3秒）
					});
				} else {
					layer.msg("失败！", {
						icon : 1, // 图标，可输入范围0~6
						time : 2500
					// 2秒关闭（如果不配置，默认是3秒）
					});
				}
			}
		});
		// 刷新数据表格
		table.reload('userTable', {
			url : 'system/user'
		});
		return false; // 阻止表单跳转。如果需要表单跳转，去掉这段即可。
	});
	
	//修改表单提交
	form.on('submit(updateUserBtn)', function(data) {
		
		data.field.orgName = $("#updateOrgName :selected").text();
		//执行后台代码
		$.ajax({
			type: 'POST',
			async: false,
			url: 'system/user',
			data: data.field,
			success:function(data){
				//关闭页面上所有类型的所有弹框
				layer.closeAll();
				if(data.result==1){
					layer.msg("修改成功！", {
						icon : 1, //图标，可输入范围0~6
						time : 2500 //2秒关闭（如果不配置，默认是3秒）
					});
				}else{
					layer.msg("修改失败！", {
						icon : 1, //图标，可输入范围0~6
						time : 2500 //2秒关闭（如果不配置，默认是3秒）
					});
				}
			
			}
		});
		//刷新数据表格
		table.reload('userTable', {
			url : 'system/user'
		});
		return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
	});
	

	// 头工具栏事件
	table.on('toolbar(userTableEvent)', function(obj) {
		// 获取当前表格选中状态和选中的数据
		var checkStatus = table.checkStatus(obj.config.id);
		// 区分点击的按钮
		switch (obj.event) {
		case 'addUser':
			// 弹出新增模态框
			initAddUserModal();
			break;
		case 'updateUser':
			// 选择的数据数量
			if (checkStatus.data.length > 1) {
				layer.msg( "最多只能修改一行数据哦！！", {
					icon : 0, //图标，可输入范围0~6
					time : 2500
				//2秒关闭（如果不配置，默认是3秒）
				});
			} else if (checkStatus.data.length < 1) {
				layer.msg( "请选择要修改的数据哦！！", {
					icon : 3, //图标，可输入范围0~6
					time : 2500
				//2秒关闭（如果不配置，默认是3秒）
				});
			}  else if (checkStatus.data[0].useable=='N') {
				layer.msg( "该用户被禁用了哦！！", {
					icon : 4, //图标，可输入范围0~6
					time : 2500
				//2秒关闭（如果不配置，默认是3秒）
				});
			} 
			else {
				// 弹出修改模态框，传递当前选中的一行数据过去
				initUpdateUserModal(checkStatus.data[0]);
			}
			break;
		case 'frozenRecord':
			// 当前选中行的数据
			var data = checkStatus.data;
			//判断是否有选中
			if (checkStatus.data.length < 1) {
				layer.msg( "请选择你要冻结的用户！！", {
					icon : 4, //图标，可输入范围0~6
					time : 2500//2秒关闭（如果不配置，默认是3秒）
				});
			}
			// 定义一个要删除的所有资源ID的字符串
			var userIdStr = "";
			// 遍历传递过来的要删除的数据
			for (var i = 0; i < data.length; i++) {
				if (data[i].useable=='N') {
					layer.msg("所选用户中有被冻结的用户！", {
						icon : 1, // 图标，可输入范围0~6
						time : 2500
					// 2秒关闭（如果不配置，默认是3秒）
					});
					return;
				}
				// 拿出用户ID进行拼接
				userIdStr += data[i].userId + ",";

			}
			// 截取掉因为拼接产生的多余的一个逗号
			userIdStr = userIdStr.substring(0, userIdStr.length - 1);
			frozenORrecoverArchives(userIdStr, 'N');
			break;
		case 'restoreRecord':
			// 当前选中行的数据
			var data = checkStatus.data;
			//判断是否有选中
			if (checkStatus.data.length < 1) {
				layer.msg( "请选择你要还原的用户！！", {
					icon : 4, //图标，可输入范围0~6
					time : 2500//2秒关闭（如果不配置，默认是3秒）
				});
			}
			// 定义一个要删除的所有资源ID的字符串
			var userIdStr = "";
			// 遍历传递过来的要删除的数据
			for (var i = 0; i < data.length; i++) {
				if (data[i].useable=='Y') {
					layer.msg("所选用户中有可用的用户！", {
						icon : 1, // 图标，可输入范围0~6
						time : 2500
					// 2秒关闭（如果不配置，默认是3秒）
					});
					return;
				}
				// 拿出资源ID进行拼接
				userIdStr += data[i].userId + ",";
			}
			// 截取掉因为拼接产生的多余的一个逗号
			userIdStr = userIdStr.substring(0, userIdStr.length - 1);
			frozenORrecoverArchives(userIdStr, 'Y');
			break;
		}
		;
	});
	// 监听锁定操作
	form.on('switch(useable)', function(obj) {
		frozenORrecoverArchives(obj.value, this.checked == true ? 'Y' : 'N');
	});
	// 关闭模态框 新增和修改模态框共用这个点击事件
	$(".modalClose").click(function() {
		// 关闭页面上所有类型的所有弹框
		layer.closeAll();
	});
	// 定义冻结或还原的方法
	var frozenORrecoverArchives = function(userIdStr, status) {
		// 用户ID
		var userId = userIdStr;
		// 定义提示信息, 状态
		var msg, useable;
		if (status == 'Y') {
			msg = "还原", useable = 'Y';
		} else {
			msg = "禁用", useable = 'N';
		}
		// 发送异步请求冻结或还原资源
		$.ajax({
			async : false, // 默认为true，false表示同步，如果当前请求没有返回则不执行后续代码
			type : "post",
			url : 'system/user/' + userId + "/" + useable,
			data : {
				_method : 'DELETE'
			},
			datatype : 'json',
			success : function(result) {
				if (result == "success") {
					layer.msg(msg + "成功！", {
						icon : 1, // 图标，可输入范围0~6
						time : 2500
					// 2秒关闭（如果不配置，默认是3秒）
					});
				} else {
					layer.msg(msg + "失败！", {
						icon : 2,
						time : 2500
					});
				}
				// 刷新数据表格
				table.reload('userTable', {
					url : 'system/user'
				});
			}
		});
	}

	// 初始化新增模态框
	var initAddUserModal = function() {
		// 弹出一个页面层
		layer.open({
			type : 1 // 基本层类型0~4，1为页面层
			,
			title : '添加用户' // 标题
			,skin: 'layui-layer-lan'//设置表头颜色
			,
			area : [ '400px','500px' ] // 宽高 只写一个参数就是表示宽度，高度会自适应
			,content : $("#addUserModal") // 文本、html都行
			,
			anim : 0 // 弹出动画
			,
			resize : false // 是否允许拉伸
			,
			end : function() { // 弹出层销毁时的回调函数（不论何种方式，只要关闭了就执行）
				// 清空表单
				$("#addUserForm")[0].reset();
				$("#demo1").attr("src","");
				$("#demoText").text("");
			}
		});

	}

	// 初始化修改模态框
	var initUpdateUserModal = function(data) {
		// 弹出一个页面层
		layer.open({
			type : 1 // 基本层类型0~4，1为页面层
			,
			title : '修改用户' // 标题
			,skin: 'layui-layer-lan'//设置表头颜色
			,area : [ '400px','500px'  ] // 宽高 只写一个参数就是表示宽度，高度会自适应
			,
			content : $("#updateUserModal") // 文本、html都行
			,
			anim : 0 // 弹出动画
			,
			resize : false // 是否允许拉伸
			,
			end : function() { // 弹出层销毁时的回调函数（不论何种方式，只要关闭了就执行）
				// 清空表单
				$("#updateUserForm")[0].reset();
				$("#demo1").attr("src","");
				$("#demoText").text("");
			}
		});

		// 表单赋值
		form.val('updateUserForm', {
			"userId" : data.userId,
			"userName" : data.userName, //layui.util.toDateString(data.commonStart, 'HH:mm:ss'),
			"password" : data.password,
			"userPhone" : data.userPhone,
			"orgId" : data.orgId,
			"orgName" : data.orgName,
			"userSex" : data.userSex,
			"userBirthdate" : data.userBirthdate,
			"userHiredate" : data.userHiredate,
			"useable" : data.useable,
			"description" : data.description,
			"headImage":data.file,
		});
	}
	
	
	$.ajax({
		url : 'system/org',
		dataType : 'json',
		type : 'post',
		success : function(data) {
			$.each(data, function(index) {
				var orgName = data[index].orgName;
				var orgId = data[index].orgId;
				/* var sdSdd = data[index].sdSdd; */
				// 头部的搜索
				$("#queryOrgName").append(
						"<option value='" + orgName + "'>" + orgName
								+ "</option>");
				// 添加
				$("#addOrgName").append(
						"<option value='" + orgId + "'>" + orgName
								+ "</option>");
				// 修改
				$("#updateOrgName").append(
						"<option value='" + orgId + "'>" + orgName
								+ "</option>");
				
				// form.render()渲染将option添加进去
				form.render();
			});

		}
	});
	
	 //普通图片上传
    var uploadInst = upload.render({
        elem: '#test1'
        ,url: 'system/upload'
        ,accept:'images'
        ,size:50000
        ,before: function(obj){
            obj.preview(function(index, file, result){
                $('#demo1').attr('src', result);
            });
        }
        ,done: function(res){
        	
        	console.log(typeof res)
        	console.log(res)
        	console.log(res.src)
            //如果上传失败
            if(res == null || res == ""){
                return layer.msg('上传失败');
            }
            //上传成功
            $('#demoText').html('<span style="color: #4cae4c;">上传成功</span>');
            //
            headImage = res.src;
        }
        ,error: function(){
            //演示失败状态，并实现重传
            var demoText = $('#demoText');
            demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
            demoText.find('.demo-reload').on('click', function(){
            uploadInst.upload();
            });
        }
    });
	
	// 表单校验
	form.verify({
		pass: [
		    /^[\S]{6,12}$/
		    ,'密码必须6到12位，且不能出现空格'
		  ] ,
		mobile: function(value, item){
		    var msg;
		    $.ajax({
		        type: "POST",
		        url: 'system/toVerifyUserPhone',
	                async: false, // 使用同步的方法
	                data: {
	      				    'userPhone':value
	                },
	                dataType: 'json',
	                success: function(result) {
	                    if (result.data) {
	                        msg = result.msg;
	                    }
	                }
	            });
		    return msg;
		}

			
				
		});
	
	
	
	
	
	


	
});
